<div class="batch-import-container">
  <div class="form-header">
    <h1>批量导入题目</h1>
    <div class="header-actions">
      <button type="button" class="btn btn-secondary" (click)="cancel()">取消</button>
      <button type="button" class="btn btn-outline-primary" (click)="loadSample()">加载示例</button>
      <button type="button" class="btn btn-primary" [disabled]="importing" (click)="onImport()">
        <span *ngIf="importing">导入中...</span>
        <span *ngIf="!importing">开始导入</span>
      </button>
    </div>
  </div>

  <!-- 成功消息 -->
  <div *ngIf="successMessage" class="success-message">
    <i class="fas fa-check-circle"></i>
    <p>{{ successMessage }}</p>
  </div>

  <!-- 错误消息 -->
  <div *ngIf="error" class="error-message">
    <i class="fas fa-exclamation-triangle"></i>
    <p>{{ error }}</p>
  </div>

  <!-- 导入表单 -->
  <div class="import-form">
    <div class="form-section">
      <h2>JSON数据输入</h2>
      <p class="help-text">
        请输入符合格式的JSON数组，每个对象代表一道题目。
        <a href="#" (click)="loadSample(); $event.preventDefault()">点击这里加载示例数据</a>
      </p>
      
      <div class="form-group">
        <label for="jsonInput">题目数据 (JSON格式)</label>
        <textarea 
          id="jsonInput" 
          [(ngModel)]="jsonInput"
          class="form-control json-input"
          rows="20"
          placeholder="请输入JSON格式的题目数据..."></textarea>
      </div>
    </div>

    <!-- 格式说明 -->
    <div class="format-section">
      <h3>数据格式说明</h3>
      <div class="format-example">
        <pre><code>[
  &#123;
    "title": "题目标题",
    "description": "题目描述（支持Markdown）",
    "difficulty": "Easy|Medium|Hard",
    "timeLimit": 1000,
    "memoryLimit": 128,
    "testCases": [
      &#123;
        "input": "输入数据",
        "expectedOutput": "期望输出",
        "isSample": true
      &#125;
    ]
  &#125;
]</code></pre>
      </div>
      
      <div class="format-notes">
        <h4>字段说明：</h4>
        <ul>
          <li><strong>title</strong>: 题目标题（必填）</li>
          <li><strong>description</strong>: 题目描述，支持Markdown格式（必填）</li>
          <li><strong>difficulty</strong>: 难度等级，可选值：Easy、Medium、Hard（必填）</li>
          <li><strong>timeLimit</strong>: 时间限制，单位毫秒，范围100-10000（必填）</li>
          <li><strong>memoryLimit</strong>: 内存限制，单位MB，范围16-1024（必填）</li>
          <li><strong>testCases</strong>: 测试用例数组（必填）</li>
          <li><strong>isSample</strong>: 是否为示例用例，true表示示例用例（必填）</li>
        </ul>
      </div>
    </div>
  </div>
</div> 